<template>
  <div>
    <el-card>
      <el-form :inline="true" :model="params" class="demo-form-inline">

    <el-form-item label="支付状态">
      <el-select
        v-model="params.status"
        placeholder="请选择"
        clearable
      >
        <el-option label="未支付" :value="1" />
        <el-option label="已支付" :value="2" />
       
      </el-select>
    </el-form-item>
   
    <el-form-item>
      <el-button type="primary" @click="search">查询</el-button>
    </el-form-item>
  </el-form>
    </el-card>
    <el-card>
      <el-table :data="tableData" style="width: 100%">
        <el-table-column prop="orderId" label="订单号" width="380">
          <!-- <template #default="scope">
            {{
              scope.row.category 
            
            }}月
          </template> -->
        </el-table-column>
        <el-table-column prop="createDate" label="创建时间" width="250">
          <template #default="scope">
            {{ formDataMoment(scope.row.createDate) }}
          </template>
        </el-table-column>

        <el-table-column prop="payDate" label="支付时间">
          <template #default="scope">
            {{ formDataMoment(scope.row.payDate) }}
          </template>
        </el-table-column>
        <!-- <el-table-column prop="outDate" label="支付完成时间">
          <template #default="scope">
            {{ formDataMoment(scope.row.outDate) }}
          </template>
        </el-table-column> -->
        <el-table-column prop="origin" label="状态">
          <template #default="scope">
            {{ scope.row.origin == 'wx' ? "微信" : "其他" }}
          </template>
        </el-table-column>
        <el-table-column prop="status" label="状态">
          <template #default="scope">
            {{ scope.row.status == 1 ? "未支付" : "已支付" }}
          </template>
        </el-table-column>
        <!-- <el-table-column prop="action" label="操作">
          <template #default="scope">
            
            <el-popconfirm
              title="确认删除吗"
              confirm-button-text="确认"
              cancel-button-text="删除"
              @confirm="handleDelete(scope.row._id)"
            >
              <template #reference>
                <el-button size="small" type="danger">删除</el-button>
              </template>
            </el-popconfirm>
          </template>
        </el-table-column>  -->
      </el-table>
      <el-pagination
        background
        layout="prev, pager, next"
        :total="total"
        @current-change="handleCurrentChange"
        :page-size="10"
      />
    </el-card>
  </div>
</template>

<script setup>
import moment from "moment";
import { ref, onMounted } from "vue";
import axios from 'axios';
const params = ref({
  status:1,
  page:1
  
})
const total = ref(0)
const tableData = ref([])
onMounted(()=>{
  getList()
})
const getList = async() => {
  const res = await axios.get('/wxapi/comment/getOrderList',{
    params:params.value
  })
  console.log('res',res.data)
  if(res.data.code == 200) {
    tableData.value = res.data.data.result
    total.value = res.data.data.total
  }
}
const handleCurrentChange = (e) => {
  console.log('111')
  params.value.page = e
  getList();
}
const search = () => {
  params.value.page = 1
  getList()
}
const formDataMoment = (date) => {
  return moment(date).format("YYYY-MM-DD HH:mm:ss");
};
</script>

<style lang="scss" scoped>
.cover {
  width: 178px;
  height: 178px;
}
</style>